<template>
  <a-modal :title="this.title" :visible="this.visible" :width="660" @cancel="cancel" @ok="ok">
    <a-spin v-show="isUpload" size="large">
    </a-spin>
    <a-form :form="form" v-bind="formItemLayout">
      <a-form-item label="文件">
        <a-upload
          name="file"
          :action="this.action"
          :data="this.param"
          :headers="headers"
          :showUploadList="false"
          @change="handleChange"
          :before-upload="beforeUpload"
          v-decorator="this.validator.upload"
          :disabled="this.see"
        >
          <a-button>
            <a-icon type="upload" />选择文件
          </a-button>
        </a-upload>
        <a-button style="margin-left:40px" type="danger" @click="clearUpload">
          <a-icon type="delete" />清空文件
        </a-button>
      </a-form-item>
      <a-form-item label="数据标识">
        <a-input v-decorator="this.validator.fileConfig" />
      </a-form-item>
      <a-form-item label="日期">
        <a-date-picker v-decorator="this.validator.fileTime" />
      </a-form-item>
      <a-form-item label="级别">
        <a-select v-decorator="this.validator.scanLevel">
          <a-select-option v-for="(item, key) of scanChoice" :value="item" :key="item">{{item}}</a-select-option>
        </a-select>
      </a-form-item>
      <!--      <a-form-item label="范围" >-->
      <!--        <a-select  v-decorator="this.validator.region" >-->
      <!--          <a-select-option v-for="(item, key) of location"-->
      <!--                           :value="item.label"-->
      <!--                           :key='item.label'-->
      <!--          >{{item.label}}</a-select-option>-->
      <!--        </a-select>-->
      <!--      </a-form-item>-->
      <a-form-item label="范围">
        <a-tree-select
          v-decorator="this.validator.region"
          :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
          :tree-data="this.treeData"
          allow-clear
          show-search
          style="width: 100%"
          tree-checkable
          tree-default-expand-all
          :show-checked-strategy="SHOW_PARENT"
        >
        </a-tree-select>
      </a-form-item>
<!--      <a-form-item label="自定义范围">-->
<!--        <a-input type="textarea" v-decorator="this.validator.area" />-->
<!--      </a-form-item>-->
    </a-form>
  </a-modal>
</template>

<script>
import moment from 'moment';
import aModal from '@/common/modal';
import {
  GETALLREGION,
  CLEARUPLOAD,
  IMPORTFILE,
  CLEARUPLOADUPDATE,
  IMPORTFILEUPDATE,
  REGIONTREE
} from '@/../static/js/apis.js';
import Global from '@/../static/js/global.js'
import {TreeSelect} from "ant-design-vue";
const SHOW_PARENT=TreeSelect.SHOW_PARENT
export default {
  inject: ['reload'],
  name: 'importModal',
  props: ['title', 'visible', 'action', 'param', 'type', 'validator'],
  components: {
    aModal
  },
  data () {
    return {
      formItemLayout: {
        labelCol: { span: 6 },
        wrapperCol: { span: 14 }
      },
      // validator:importForm,
      // uploadParam:{
      //   userId:1
      // },
      // fileAction:UPLOADFILE.url,
      scanChoice: [
        1,
        2,
        3,
        4,
        5,
        6,
        7,
        8,
        9,
        10,
        11,
        12,
        13,
        14,
        15,
        16,
        17,
        18,
        19,
        20
      ],
      location: [],
      treeData: {},
      isUpload:false,
      fileList:[],
      num:0,
      finishNum:0,
      see:false,
      SHOW_PARENT,
    }
  },
  beforeCreate () {
    this.form = this.$form.createForm(this, { name: 'validate_other' })
  },
  methods: {
    beforeUpload(file,filelist) {
      // console.log(filelist);
      // this.fileList = [...this.fileList, file];
      // this.fileList = filelist;
      // if(filelist.length>Global.maxFileNum){
      //   // if(this.num ===0){
      //   //   this.$message.error("文件数量超出限制！")
      //   // }
      //   filelist = [];
      //   return false;
      // }else{
      //   this.isUpload = true;
      // }
      //文件类型
      var fileName = file.name.substring(file.name.lastIndexOf('.') + 1)
      if (fileName !== 'zip' && fileName !== 'rar') {
        this.$message.error('文件类型必须是zip或rar!')
        return false
      }else{

        this.isUpload=true;
      }

    },
    handleChange(info) {

      // if (info.file.status !== 'uploading') {
      //   //console.log(info);
      //   if(this.fileList.length > Global.maxFileNum && this.num === 0) {
      //     this.num++;
      //     this.fileList=[];
      //     // info.fileList=[];
      //     this.$message.error("文件数量超出限制！文件数不得超过"+Global.maxFileNum)
      //     return  false;
      //   }else if(this.num !== 0){
      //     this.num ++;
      //   }
      //   // else if(this.fileList.length > Global.maxFileNum){
      //   //   return false;
      //   // }
      // }/*else if(info.file.status === 'error'&&this.num !== 0){
      //       this.num =0;
      //    }*/
      // console.log(this.num);
      // if (info.file.status === 'done' && this.fileList.length<=Global.maxFileNum) {
      //   //this.isUpload=false;
      //   this.$message.success(`${info.file.name} 上传成功`);
      //   // this.fileList=[];
      //   this.num = 0;
      //   this.finishNum++;
      // } else if (info.file.status === 'error' && this.fileList.length<=Global.maxFileNum) {
      //   this.$message.error(`${info.file.name} 上传失败`);
      //   // this.fileList=[];
      //   this.num = 0;
      //   this.finishNum++;
      // }
      //
      //
      // console.log(info);
      // if(( info.file.status === 'done'||info.file.status === 'error')&& this.finishNum==this.fileList.length){
      //   // console.log(this.fileList);
      //   this.isUpload=false;
      //   this.finishNum=0;
      //   this.fileList=[];
      //   info.fileList=[];
      //
      // }else if(this.num==this.fileList.length){
      //   this.num = 0;
      // }
      if(info.file.status==='done'){
        this.isUpload=false;
        this.see=true;
        this.$message.success(`${info.file.name} 上传成功`);
      }else if (info.file.status === 'error'){
        this.isUpload=false;
        this.$message.success(`${info.file.name} 上传失败`);
      }


    },

    clearUpload () {
      let self = this
      if (self.type == '新建') {
        CLEARUPLOAD('', function (res) {
          self.form.resetFields('upload')
          self.$message.success(res.message)
          self.see=false;
        })
      } else {
        CLEARUPLOADUPDATE(this.param, function (res) {
          self.form.resetFields('upload')
          self.$message.success(res.message)
          self.see=false;
        })
      }
    },
    ok (e) {
      let self = this
      e.preventDefault()
      if (self.type == '新建') {
        self.form.validateFields((err, values) => {
          if (!err) {
            values.fileTime = values.fileTime.format('YYYY-MM-DD')
            console.log('Received values of form: ', values)
            values.userId = self.param.userId
            values.menuId = 21
            IMPORTFILE(values, function (res) {
                  if(res.code=='200'){
                      self.$message.success(res.message);
                      self.reload()
                  }else{
                    self.$message.error(res.message);
                  }
            })
            this.visible = false;
          }
        })
        self.see=false
      } else {
        console.log(self.validator)
        self.form.validateFields((err, values) => {
          if (!err) {
            values.fileTime = values.fileTime.format('YYYY-MM-DD')
            console.log('Received values of form: ', values)
            values.userId = self.param.userId
            values.fileId = self.param.fileId
            values.menuId = 21
            IMPORTFILEUPDATE(values, function (res) {
                  if(res.code=='200'){
                      self.$message.success(res.message);
                      self.reload()
                  }else{
                    self.$message.error(res.message);
                  }
            })
            this.visible = false;
          }
        })
        self.see=false
      }
    },
    /* 关闭modal*/
    cancel (e) {
      this.clearUpload();
      this.see=false;
      this.$emit('cancel', e)
    },
    getStaticData () {
      let self = this
      // GETALLREGION('',function(res){
      //   console.log(res.obj[1]);
      //   self.location = res.obj;
      //
      // })
      REGIONTREE('', function (res) {
        console.log(res)
        self.treeData = res.obj
      })
    }
  },
  computed: {
    headers () {
      return {
        "token" : localStorage.getItem("token")
      }
    }
  },
  created () {
    this.getStaticData()
  }
}
</script>

<style scoped>
.ant-spin-spinning {
  height: 300px;
  width: 600px;
  background: #eeeeee91;
  line-height: 200px;
  position: absolute;
  z-index: 1000;
}
</style>
